<!--
 * @Description: 
 * @Author: muweng
 * @Date: 2021-08-26 09:21:27
 * @LastEditTime: 2021-08-26 11:19:51
 * @LastEditors: muweng
-->
<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <link rel="icon" href="./favicon.ico">
  <!-- import CSS -->
  <link rel="stylesheet" href="./css/ele.css">
  <!-- import Vue before Element -->
  <script src="./js/vue.js"></script>
  <script src="./js/vue-router.js"></script>
  <script src="./js/httpVueLoader.js"></script>

</head>

<body>
  <div id="app">
    <h1>utools工具集</h1>
    <p>
      <router-link to="/chatRoom">跳转到页面一</router-link>
      <router-link to="/page2">跳转到页面二</router-link>
    </p>
    <router-view></router-view>
  </div>
</body>

<script>
  const routes = [
    {
      path: '/chatRoom',
      name: 'chatRoom',
      component: httpVueLoader('./views/chatRoom.vue')
    },
    {
      path: '/page2',
      name: 'page2',
      component: httpVueLoader('./views/page2.vue')
    }
  ]

  const router = new VueRouter({
    routes // (缩写) 相当于 routes: routes
  })
  // 使用httpVueLoader
  Vue.use(httpVueLoader);
  const app = new Vue({
    router,
  }).$mount('#app')

</script>

</html>